<%-- 
    Document   : datelog
    Created on : 12/06/2011, 04:24:05 م
    Author     : Mostafa
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="html" uri="http://struts.apache.org/tags-html" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
         <link rel="stylesheet" media="all" type="text/css" href="css/jquery-ui-1.8.6.custom.css" />
         <script type="text/javascript" src="js/jquery-1.5.1.js"></script>

     
        <script type="text/javascript" src="js/jquery.ui.datepicker.js"></script>
        <script type="text/javascript" src="js/jquery.ui.widget.js"></script>
        <script type="text/javascript" src="js/jquery.ui.core.js"></script>

        <style>
            .ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; }
            .ui-timepicker-div dl{ text-align: left; }
            .ui-timepicker-div dl dt{ height: 25px; }
            .ui-timepicker-div dl dd{ margin: -25px 10px 10px 65px; }
            .ui-timepicker-div td { font-size: 90%; }
        </style>
    </head>
    <script>
   $(function() {
		
              $( "#datepicker" ).datepicker({ dateFormat: "dd/mm/yy" ,
			showButtonPanel: true , 
                        onClose: function(dateText, inst) { start(); }    
                } );
               
                

     
  
	});
        
        
        
        var xmlhttp;
          
        var operation="next";
        
            function search()
            {
                var searchtext=document.getElementById("stext").value;
            
                
                
                if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
               
            xmlhttp.onreadystatechange=handleRequest;
            xmlhttp.open("GET","search.do?searchtext=" + searchtext,true);
            xmlhttp.send();
            
            
            }
            function handleRequest(){
                if(xmlhttp.readyState==4){
                    var divresult=document.getElementById("result");
                   var get=xmlhttp.responseText;
            var result=get.split(",");
             var ret="";            
             if(get[0]==" ")
              { 
                  
                  ret="";
                 
                     
              }
              else{  
                  
                    ret+="<select id=\"providers\" style=\"width:165px\" onchange=\"start()\" name=\"providername\" multiple=\"true\" > ";
                
                    for (i = 0; i < result.length; i++) {
                    
                    ret+="<option value=\""+result[i]+"\" >  "+result[i]+" </option> ";
                    }
                    ret+="</select>  ";
                
                }
            divresult.innerHTML=ret;
                }
            }
            
            
            function change(){
                var date = document.getElementById("datepicker").value;
                
                  if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
             
              if(document.getElementById("providers")!=null)
                  {
                      
                   var provider = document.getElementById("providers").value;
            xmlhttp.onreadystatechange=handlechange;
            xmlhttp.open("GET","pdate.do?date=" + date+"&operation="+operation+"&provider="+provider,true);
            xmlhttp.send();
                  }
                  else{
                      
                      var divresult=document.getElementById("logdiv");
                       divresult.innerHTML="select provider first";
              //         alert("nulllllllllllllllllllll");
                  }
                 
              
                
            }
         function handlechange()
            {
                
                if(xmlhttp.readyState==4){
                    var divresult=document.getElementById("logdiv");
                    var txt=xmlhttp.responseText;
                   divresult.innerHTML=txt;
                 
                 
                   if(txt!="No Data Available Previous ...."&&txt!="")
                  divresult.innerHTML+=" <br> <input type=\"button\" value=\"Previous\" onclick=\"previous()\"/>";
            
            
                  if(txt!="No Data Available Next ...."&txt!="")
                  divresult.innerHTML+=" <input type=\"button\" value=\"Next\" onclick=\"next()\"/>";
                  
                  
                }
                
            }
            
            
            function next()
            {
              
                operation="next";
                change();
                
            }
            
            function previous()
            {
               
                 operation="back";
                 
                change();
                
                
            }
            
            function start()
            {
                
                operation="start";
                change();
            }
            
   
            
           
	</script> 
    
    <body> 
 
        <table>
            <tr>
                <td>Date: <input type="text" id="datepicker" /> </td>
                <td>Search Provider : <input type="text"  name="searchtext" id="stext" onkeyup="search()" /></td>
            </tr>

            <tr>
                <td></td>
                <td>
                     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
             &nbsp;&nbsp;&nbsp;
                    <span id="result"></span></td>
            </tr>


      
             
             
             </table>

<div id="logdiv"></div>

 
</body> 
</html>
